import axios from 'axios'
import store from '@/store'
import router from '@/router'
export const baseURL = 'http://pcapi-xiaotuxian-front-devtest.itheima.net/'

//todo 1.创建一个axios实例
const instance = axios.create({
    //*  给axios的一些配置
    baseURL,
    // timeout: 1000
})

//todo 2.请求拦截器，如果有token进行头部携带
instance.interceptors.request.use((config) => {
    // * 检查是否有token值
    const { profile } = store.state.user
    if (profile.token) {
        config.headers.Authorization = `Bearer ${profile.token}`
    }
    return config
}, (erro) => {
    return Promise.reject(erro)
})

//todo 3.响应拦截器：1.剥离无效数据 2.处理token失效
instance.interceptors.response.use(
    // * 直接返回data中的数据 剥离无效数据
    res => res.data,
    erro => {
        // * 401状态码 请求要求身份验证。 对于需要登录的网页，服务器可能返回此响应
        if (erro.response && erro.response.status === 401) {
            // * 未登录时
            // * 1.清空无效用户信息,传入一个空对象
            store.commit('user/setUser', {})
            // * 2.跳转到登录页
            //  a此处有坑！
            // 1.router.currentRoute 相当于 $route 但是$route.path或者$route.fullPath只能在组建中用 js模块中要是用router.currentRoute
            // 2.router.currentRoute是ref响应式数据 要拿值的话需要.value
            // 3.encodeURIComponent 这个api是用来解析获得的fullPath中的特殊字符的
            const fullPath = encodeURIComponent(router.currentRoute.value.fullPath)
            router.push('/login?redirectUrl=' + fullPath)
        }
        return Promise.reject(erro)
    })

//todo 4.导出一个函数，调出当前的axios实例发请求 返回值promise
export default (url, method, submitData) => {
    return instance({
        url,
        method,
        //* 判断如果是get请求 使用params来传递submitData 如果不是get请求 用data传递
        //* []是用来设置一个动态的key 里面可以写js表达式 执行的结果当做key
        // * method有可能是get Get GET 统一转成小写再判断
        [method.toLowerCase() === 'get' ? 'params' : 'data']: submitData
    })
}